<template>
    <a-row :gutter="10">
        <a-col :md="leftColMd" :sm="24" style="margin-bottom: 20px">
            <a-card :bordered="false">
                <!-- 查询区域 -->
                <div class="table-page-search-wrapper">
                    <!-- 搜索区域 -->
                    <a-form layout="inline" @keyup.enter.native="searchQuery">
                        <a-row :gutter="24">
                            <a-col :md="12" :sm="8">
                                <a-form-item label="路线名称" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
                                    <a-input placeholder="路线名称" v-model="queryParam.lineName"></a-input>
                                </a-form-item>
                            </a-col>
                            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
                            <a-col :md="12" :sm="24">
                                 <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
                               <a-button type="primary" @click="searchQuery" icon="search"
                                         style="margin-left: 21px">查询</a-button>
                              <a-button type="primary" @click="searchReset" icon="reload"
                                        style="margin-left: 8px">重置</a-button>
                            </a-col>
                          </span>
                        </a-row>
                    </a-form>
                </div>

                <div style="margin-top: 15px">
                    <a-table
                        style="height:500px"
                        ref="table"
                        size="middle"
                        bordered
                        rowKey="id"
                        :columns="columns"
                        :dataSource="dataSource"
                        :pagination="ipagination"
                        :loading="loading"
                        :rowSelection="{selectedRowKeys: selectedRowKeys1, onChange: onSelectChange1, type:'radio'}"
                        @change="handleTableChange">
                          <span slot="action" slot-scope="text, record">
                                <a @click="bindCustomer(record)">医院名单</a>
                                <a-divider type="vertical"/>
                                <a @click="handleOpen(record,2)">绑定回收员</a>
                                <a-divider type="vertical"/>
                                 <a-dropdown>
                                        <a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
                                <a-menu slot="overlay">
                                  <a-menu-item>
                                        <a @click="handleEdit(record)">编辑</a>
                                  </a-menu-item>
                                  <a-menu-item >
                                        <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
                                          <a>删除</a>
                                        </a-popconfirm>
                                  </a-menu-item>
                                </a-menu>
                              </a-dropdown>
                            </span>
                    </a-table>
                </div>
                <hc-path-modal ref="modalForm" @ok="modalFormOk"></hc-path-modal>
                <path-bin-customer ref="pathBinCusRef"></path-bin-customer>
            </a-card>
        </a-col>


        <!-- 收运员绑定的车辆信息模块 -->
        <a-col :md="rightColMd" :sm="24" v-if="this.rightcolval == 2">
            <a-card :bordered="false">
                <div style="text-align: right;">
                    <a-icon type="close-circle" @click="hideRightList"/>
                </div>
                <!-- 查询区域 -->
                <div class="table-page-search-wrapper">
                    <a-form layout="inline" @keyup.enter.native="searchQuery3">
                        <a-row :gutter="24">
                            <a-col :md="12" :sm="8">
                                <a-form-item label="收运人" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
                                    <a-input placeholder="收运人" v-model="queryParam3.personName"></a-input>
                                </a-form-item>
                            </a-col>
                            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
                            <a-col :md="12" :sm="24">
                                <a-button type="primary" @click="searchQuery3" icon="search"
                                       style="margin-left: 21px">查询</a-button>
                                <a-button @click="handleAdd3" type="primary" icon="plus" >
                                    绑定回收员
                                </a-button>
                            </a-col>
                          </span>
                        </a-row>
                    </a-form>
                </div>
                <!-- 操作按钮区域 -->
                <div>
                    <a-table
                        style="height:500px"
                        ref="table2"
                        bordered
                        size="middle"
                        rowKey="id"
                        :columns="columns3"
                        :dataSource="dataSource3"
                        :pagination="ipagination3"
                        :loading="loading3"
                        @change="handleTableChange3">
                        <span slot="action" slot-scope="text, record">
                            <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete3(record.id)">
                              <a>删除</a>
                            </a-popconfirm>
                        </span>
                    </a-table>
                </div>
                <hc-re-user-modal ref="hcReUserModelRef" :currentCompanysId="currentCompanysId" @ok="loadData3(1)"></hc-re-user-modal>
            </a-card>
        </a-col>
    </a-row>
</template>
<script>
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { deleteAction, getAction } from '@/api/manage'
import { filterObj } from '@/utils/util'
import HcReUserModal from '@views/tianzhiyuan/modules/HcReUserModal'
import HcPathModal from './modules/HcPathModal'
import PathBinCustomer from "@views/tianzhiyuan/modules/PathBinCustomer";

export default {
    mixins: [JeecgListMixin],
    components: {
        HcReUserModal,
        PathBinCustomer,
        HcPathModal
    },
    data() {
        return {
            model1: {},
            currentUserId: '',
            currentCompanysId:'',
            loading1: false,
            selectedRowKeys1: [],
            selectionRows1: [],
            rightcolval: 0,
            columns:[
                    {
                        title: '路线编号',
                        align: 'center',
                        dataIndex: 'id'
                    },
                    {
                        title: '路线名称',
                        align: 'center',
                        dataIndex: 'lineName'
                    },
                    {
                        title: '处置单位',
                        dataIndex: 'companyName',
                        align: 'center',
                    },
                    {
                        title: '操作',
                        dataIndex: 'action',
                        align: 'center',
                        scopedSlots: { customRender: 'action' }
                    }
                ],
            // 高级查询参数
            superQueryParams2: '',
            // 高级查询拼接条件
            superQueryMatchType2: 'and',
            url: {
                list: '/hc/line/page',
                delete: '/hc/line/delete',
                list3: '/hc/line/bindPerson',

            },
            loading3: false,
            queryParam3: {},
            dataSource3: [],
            ipagination3: {
                current: 1,
                pageSize: 10,
                pageSizeOptions: ['10', '20', '30'],
                showTotal: (total, range) => {
                    return range[0] + '-' + range[1] + ' 共' + total + '条'
                },
                showQuickJumper: true,
                showSizeChanger: true,
                total: 0
            },
            columns3: [
                {
                    title: '序号',
                    dataIndex: '',
                    key: 'rowIndex',
                    width: 60,
                    align: 'center',
                    customRender: function(t, r, index) {
                        return parseInt(index) + 1
                    }
                },
                {
                    title: '收运人',
                    align: 'center',
                    dataIndex: 'userName'
                },
                {
                    title: '操作',
                    dataIndex: 'action',
                    align: 'center',
                    scopedSlots: { customRender: 'action' }
                }
            ]
        }
    },
    created() {
        this.getSuperFieldList()
    },
    computed: {
        leftColMd() {
            return this.selectedRowKeys1.length === 0 ? 24 : 12
        },
        rightColMd() {
            return this.selectedRowKeys1.length === 0 ? 0 : 12
        }
    },
    methods: {
        searchQuery3() {
            this.loadData3(1)
        },
        bindCustomer: function(row){
            let _this = this;
            if(row){
                let ref = _this.$refs.pathBinCusRef;
                let params = row.id;
                if(ref){
                    ref.show(row,params);
                }
            }
        },
        // 组件初始信息配置
        initDictConfig() {
            // let roles = [
            //     'CT_recycler',
            //     'CT_carrier',
            //     'hc_collector',
            // ]
            // this.queryParam.roleCode = roles.join(',')
            //
            // // 根据当前用户去查询
            // let userInfo = this.$store.getters.userInfo
            // if (userInfo.companysId) {
            //     this.queryParam.companysId = userInfo.companysId;
            //     this.queryParam2.companysId = userInfo.companysId;
            //     this.queryParam3.companysId = userInfo.companysId;
            // }
        },
        hideRightList() {
            this.selectedRowKeys1 = []
        },
        onSelectChange1(selectedRowKeys, selectionRows) {
            this.rightcolval = 1
            this.selectedRowKeys1 = selectedRowKeys
            this.selectionRows1 = selectionRows
            this.model1 = Object.assign({}, selectionRows[0])
            this.currentUserId = selectedRowKeys[0]
        },
        // 左边操作模块点击事务
        handleOpen(record, type = 1) {
            this.rightcolval = type
            this.selectedRowKeys1 = [record.id]
            this.model1 = Object.assign({}, record)
            this.currentUserId = record.id
            this.currentCompanysId = record.companyId
            if (type == 2) {
                this.loadData3(1)
            }
        },
        // 重置查询
        searchReset(){
            this.queryParam.realname = ''
            this.loadData()
        },


        /**
         * ------------------------------------------------------------------------------------
         * 【收运人】绑定车辆信息模块
         * ------------------------------------------------------------------------------------
         * @returns {*}
         */
        getQueryParams3() {
            //获取查询条件
            let sqp = {}
            var param = Object.assign(sqp, this.queryParam3)
            param.pageNo = this.ipagination3.current
            param.pageSize = this.ipagination3.pageSize
            return filterObj(param)
        },
        loadData3(arg) {
            if (!this.url.list3) {
                this.$message.error('请设置url.list3属性!')
                return
            }
            //加载数据 若传入参数1则加载第一页的内容
            if (arg === 1) {
                this.ipagination3.current = 1
            }
            if (this.currentUserId === '') return
            let params = this.getQueryParams3()
            // 车辆绑定的收运员
            params['lineId'] = this.currentUserId
            this.loading3 = true
            getAction(this.url.list3, params).then((res) => {
                if (res.success) {
                    this.dataSource3 = res.result.records
                    this.ipagination3.total = res.result.total
                }
                this.loading3 = false
            })
        },
        handleTableChange3(pagination, filters, sorter) {
            //分页、排序、筛选变化时触发
            this.ipagination3 = pagination
            this.loadData3()
        },
        // 绑定回收员
        handleAdd3(item) {
            let ref = this.$refs.hcReUserModelRef
            if (ref) {
                if (item) {
                    ref.edit(item, this.currentUserId)
                } else {
                    ref.add(this.currentUserId)
                }
            }
        },
        handleDelete3(id) {
            var that = this
            deleteAction('/hc/line/deletePerson', { id: id }).then((res) => {
                console.log('res===>',res)
                if (res.success) {
                    that.$message.success(res.message)
                    this.loadData3(1)
                } else {
                    that.$message.warning(res.message)
                }
            })
        },
        getSuperFieldList() {
            let fieldList = []
            fieldList.push({ type: 'string', value: 'carNumber', text: '车牌号', dictCode: '' })
            this.superFieldList = fieldList
        },

    }
}
</script>
<style scoped>
/** Button按钮间距 */
.ant-btn {
    margin-left: 8px
}
</style>
